<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>thacher update</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" th:href="@{/css/layui.css}" media="all">
    <script th:src="@{/js/jquery-3.5.1.min.js}"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
<div class="layui-container" style="margin-top: 10px">
    <div class="layui-row">
        <div class="layui-col-lg8 layui-col-lg-offset2">
            <form class="layui-form" id="teacher-form" lay-filter="teacher-form">
                <div class="layui-form-item" hidden="hidden">
                    <label class="layui-form-label">ID</label>
                    <div class="layui-input-block">
                        <input type="text" name="id" id="id" autocomplete="off" lay-verify="id" hidden
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" hidden="hidden">
                    <label class="layui-form-label">课程号</label>
                    <div class="layui-input-block">
                        <input type="text" name="courseId" id="courseId" autocomplete="off" lay-verify="courseId" hidden
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">课程名</label>
                    <div class="layui-input-block">
                        <input type="text" name="courseName" id="courseName" autocomplete="off" lay-verify="courseName"
                               placeholder="请输入课程名"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">教师编号</label>
                    <div class="layui-input-block">
                        <input type="text" name="teacherId" id="teacherId" autocomplete="off" lay-verify="teacherId"
                               placeholder="请输入教师编号"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">学院</label>
                    <div class="layui-input-block">
                        <input type="text" name="collegeId" id="collegeId" autocomplete="off" lay-verify="collegeId"
                               placeholder="学院" disabled
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">系</label>
                    <div class="layui-input-block">
                        <input type="text" name="systemId" id="systemId" autocomplete="off" lay-verify="systemId"
                               placeholder="系" disabled
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">学分</label>
                    <div class="layui-input-block">
                        <input type="text" name="credit" id="credit" autocomplete="off" lay-verify="credit"
                               placeholder="学分"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <input type="text" name="version" id="version" lay-verify="version"
                               class="layui-input layui-hide">
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button type="submit" class="layui-btn" lay-submit lay-filter="demo1" id="sub-btn">立即提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script th:src="@{/layui.all.js}"></script>
<script>
    var request = 'http://localhost:8080/'
    layui.use('form', function () {
        var form = layui.form;
        $(function () {
            let ID = window.sessionStorage.getItem('courseID');
            $.ajax({
                url: request + '/course/query/' + ID,
                type: 'GET',
                dataType: "JSON",
                success: function (res) {
                    if (res.code === 0) {
                        let course = res.data.data;
                        course = course[0];
                        $("#id").val(course.id);
                        $("#courseName").val(course.courseName);
                        $("#courseId").val(course.courseId);
                        $("#teacherId").val(course.teacherId);
                        $("#collegeId").val(course.collegeId);
                        $("#systemId").val(course.systemId);
                        $("#credit").val(course.credit);
                        $("#version").val(course.version);
                        form.render();
                    }
                }
            })
        })

        // 自定义验证规则
        form.verify({
            id: function (value) {
                if (value.length < 1) {
                    return 'id不可改！';
                }
            },
            courseId: function (value) {
                if (value.length < 1) {
                    return '课程号不可为空！';
                }
            },
            teacherId: function (value) {
                if (value.length < 1) {
                    return '教师编号不可为空！';
                }
            },
            courseName: function (value) {
                if (value.length < 1) {
                    return '课程名不能为空！';
                }
            },
            credit: function (value) {
                if (value.length < 1) {
                    return '学分不能为空！';
                } else if (value <= 0) {
                    return "学分必须大于 0！";
                }
            }
        });
        // 监听提交
        form.on('submit(demo1)', function () {
            // submit 提交事件
            let serialize = $("#teacher-form").serialize();
            $.ajax({
                url: request + '/course/0/update',
                type: "PUT",
                data: serialize,
                dataType: "JSON",
                success: function (JSONResult) {
                    if (JSONResult.code === 0) {
                        layer.msg("修改成功！");
                    } else {
                        layer.msg("修改失败！");
                    }
                }
            });
            return false;
        });
    });
</script>
</html>